<template>
    <button class="myBtn" :class="{'myBtn2':styleType==2}" :disabled="disabled">
        <i @click="doVoice">{{text}}<slot/></i>
    </button>
</template>

<script>
import {H5CallAPPFuction} from '@/utils/common';
export default {
    props:{
        disabled:{
            type:Boolean,
            default:()=>false
        },
        text:{
            type:String,
            default:''
        },
        styleType:{
            type:Number,
            default:1
        }
    },
    methods:{
        doVoice(){
            try {
                H5CallAPPFuction('makeSound') //发出一次音效
            } catch (error) {
                //toast('无法打开app界面')
            }
        }
    }
}
</script>

<style lang="scss" scoped>
    .myBtn{
        display: block;
        width: 100%;
        height: 65px;
        line-height: 65px;
        background: url(/images/btnbg.png) left top no-repeat;
        background-size: 100% 100%;
        opacity: 1;
        border: 0;
        font-family: Inter-Medium, Inter;
        font-weight: 500;
        font-size: 26px;
        color: #FFFFFF;
        &:active{
            opacity: 0.8;
        }
        &:disabled{
            //background: #f2f2f2;
            opacity: 0.7;
        }
        &.minBtn{
            height: 56px;
            line-height: 56px;
        }
        &.myBtn2{
            background-image: url(/images/btnbg2.png);
        }
        i{
            font-style: normal;
        }
    }
</style>